<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/reset.css" />


    <!-- 自定义样式 -->
    <link rel="stylesheet" href="./css/index.css" />



</head>

<body>


    <div class="home-hero-sub">
        <div class="cate_list">
            <!-- unorder list  -->
            <ul>
                <!-- less then   greate then  -->
                <li> <a href="">电视</a> <span class="flag"> &gt; </span></li>
                <li> <a href="">家电</a> <span class="flag"> &gt; </span></li>
                <li> <a href="">笔记本 平板 显示器</a> <span class="flag"> &gt; </span></li>
                <li> <a href="">出行 穿戴</a> <span class="flag"> &gt; </span></li>
                <li> <a href="">耳机 音箱</a> <span class="flag"> &gt; </span></li>
                <li> <a href="">健康 儿童</a> <span class="flag"> &gt; </span></li>
                <li> <a href="">生活 箱包</a> <span class="flag"> &gt; </span></li>
                <li> <a href="">智能 路由器</a> <span class="flag"> &gt; </span></li>
                <li> <a href="">电源 配件</a> <span class="flag"> &gt; </span></li>



            </ul>
        </div>

        <div class="swiper">


            <div class="swiperitem">
                <img src="./imgs/swiper/s3.jpg" width="100%" height="100%" />
            </div>
            <div class="swiperitem">
                <img src="./imgs/swiper/s4.jpg" width="100%" height="100%" />
            </div>
            <div class="swiperitem">
                <img src="./imgs/swiper/s5.jpg" width="100%" height="100%" />
            </div>
            <div class="swiperitem">
                <img src="./imgs/swiper/s6.jpg" width="100%" height="100%" />
            </div>
            <div class="swiperitem">
                <img src="./imgs/swiper/s2.jpg" width="100%" height="100%" />
            </div>
            <div class="swiperitem">
                <img src="./imgs/swiper/s1.jpg" width="100%" height="100%" />
            </div>


            <div class="change changeleft">
                <div class="flag"></div>
            </div>
            <div class="change changeright">

                <div class="flag"></div>

            </div>

        </div>


        <div class="dots">
            <span></span>
            <span></span>
            <span class="active"></span>
            <span></span>
            <span></span>
        </div>


    </div>



</body>

</html>